<template>
    <footer class="w-full bg-#171717 p-15px c-#a0a1a3" id="bottom">
        <!-- <div data-v-724cefda="" class="imgbox"><img data-v-724cefda="" :src="dataStore.fbgImg" class="w-full h-45vh " alt="">
        </div>
        <div class="flex text-size-base b-b-2px b-b-solid b-b-#4e5054 relative top-40% left-50%" >
            <div class="w-35%">
                <div class="my-5px">地址：{{ dataStore.companyInfo.address }}</div>
                <div class="my-5px">邮箱：{{ dataStore.companyInfo.email }}</div>
                <div class="my-5px">网站：{{ dataStore.companyInfo.website }}</div>
                <div class="my-5px">联系方式：{{ dataStore.companyInfo.phone }}</div>
            </div>
            <div class="flex justify-between w-65% p-r-5vw">
                <div v-for="link in dataStore.tabList" :key="link.id" class="">
                    <div class="c-#fefefe mb-20px">{{ link.label }}</div>
                    <div class="flex flex-col">
                        <template v-if="link.children && link.children.length > 0">
                            <nuxt-Link 
                                v-for="subLink in link.children" 
                                :key="subLink.id" 
                                :href="subLink.path"
                                class="my-5px"
                            >{{ subLink.label }}</nuxt-Link>
                        </template>
                        <template v-else>
                            <nuxt-Link :href="link.path" class="my-5px">{{ link.label }}</nuxt-Link>
                        </template>
                    </div>    
                </div>
            </div>
        </div> -->
          <div class="footer">
            <h3>联系我们</h3>
            <h3>电话：0000-66666666</h3>
            <h3>邮箱：xxxx@xxxx.com</h3>
            <h3>地址：北京市海淀区中关村南大街6号中电信息大厦</h3>
        </div>
        <div class="flex justify-center mt-15px">北京万维高科技术有限公司 京ICP备xxxxxxx号</div>
    </footer>
</template>

<script setup>
import { ref, reactive } from 'vue'
import footerBg from '../public/images/微信图片_20250605093721.png'
const dataStore = reactive({
    fbgImg: footerBg,
    tabList: [
        {id: '1', label: '首页', path: '/', show: true, sort: '1', children: []},
        // {id: '5', label: '关于', path: '/about', show: true, sort: '3', children: [
        //     {id: '99', label: '公司介绍', path: '/about/profile', show: true, sort: '1',},
        //     {id: '99', label: '企业文化', path: '/about/culture', show: true, sort: '2',},
        //     {id: '100', label: '发展历程', path: '/about/history', show: true, sort: '3',},
        // ]},
        {id: '2', label: '产品及解决方案', path: '#products', show: true, sort: '2', children: [
            {id: '89', label: 'PHM系统', path: '#PHM', show: true, sort: '2',},
            {id: '88', label: 'X-gear大模型', path: '#X-gear', show: true, sort: '1',},
        ]},
        {id: '4', label: '行业案例', path: '#products', show: true, sort: '2', children: []},
    ],
    companyInfo: {
        phone: '0000-66666666',
        address: '北京市海淀区中关村南大街6号中电信息大厦',
        email: 'xxxx@xxxx.com',
        website: 'wwww.xxxxx.com',
    },
})

</script>

<style scoped>
 .footer {border-bottom: 2px solid #4e5054; 
            margin-top: 30px;
            padding: 20px;
            color: white;
            text-align: center;
        }
</style>